<template>
  <div>
    <div style="border-bottom:1px solid #f2f3f8;padding-bottom:10px;">
      <el-button type="info" icon="el-icon-caret-left" @click="$router.go(-1)" size="mini">返回</el-button>
    </div>
    <el-form ref="AccountEdit" :model="AccountEditInfo" :rules="Finance" size="small">
      <el-row>
        <el-col :span="10">
          <el-form-item label="类型" prop="TypeID">
            <br>
            <el-select v-model="AccountEditInfo.TypeID" placeholder="请选择" style="width:100%">
              <el-option v-for="item in options" :key="item.ID" :label="item.TypeName_CHS" :value="item.ID">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="账号" prop="AccountName">
            <el-input v-model="AccountEditInfo.AccountName" placeholder="请输入你的账号"></el-input>
          </el-form-item>
          <el-form-item label="标题" prop="Title">
            <el-input v-model="AccountEditInfo.Title" placeholder="请输入你的标题"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="4"><br></el-col>
        <el-col :span="10">
          <el-form-item label="状态" prop="StatusID">
            <br>
            <el-select v-model="AccountEditInfo.StatusID" placeholder="请选择" style="width:100%">
              <el-option v-for="item in options1" :key="item.ID" :label="item.StatusName_CHS" :value="item.ID">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="开户人" prop="Owner">
            <el-input v-model="AccountEditInfo.Owner" placeholder="请输入你的开户人"></el-input>
          </el-form-item>
          <el-form-item label="描述">
            <el-input v-model="AccountEditInfo.Description" type="textarea" :rows="7" placeholder="请输入内容">
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <div style="padding-top:10px;border-top:1px solid #f2f3f8;">
        <el-button type="primary" @click="submit('AccountEdit')" icon="el-icon-check" size="small">保存</el-button>
        <el-button @click="$router.go(-1)" size="small" icon="el-icon-close">取消</el-button>
      </div>
    </el-form>
  </div>
</template>

<script>
export default {
  data () {
    return {
      AccountEditInfo: {
        TypeID: null,
        AccountName: null,
        Title: null,
        StatusID: null,
        Owner: null
      },
      options: [
      ],
      options1: [
      ],
      Type: 'Add',
      Finance: {
        TypeID: [
          { required: true, message: '请输入你的类型', trigger: 'blur' }
        ],
        AccountName: [
          { required: true, message: '请输入你的账号', trigger: 'blur' }
        ],
        Title: [
          { required: true, message: '请输入你的标题', trigger: 'blur' }
        ],
        StatusID: [
          { required: true, message: '请输入你的状态', trigger: 'blur' }
        ],
        Owner: [
          { required: true, message: '请输入你的开户人', trigger: 'blur' }
        ]
      }
    }
  },
  //保存
  methods: {
    submit (Finance) {
      //表单验证
      this.$refs[Finance].validate((valid) => {
        if (!valid) {
          return false;
        }
        this.$axios({
          url: "/HrApi/Finance/UpdateFinanceList",
          method: "POST",
          data: this.$Qs.stringify({
            AccountEditInfo: JSON.stringify(this.AccountEditInfo),
            Type: this.Type,
            pk_User: this.$store.state.UserInfo.pk_User
          })
        }).then(res => {
          if (!res.data.code) {
            this.ListDt = res.data.data;
            this.$message.success(res.data.msg)
            if (this.Type === "Add") {
              this.$refs['AccountEdit'].resetFields();
            }
          } else {
            this.$message.error(res.data.msg);
          }
        })
      })
    },
  },
  mounted () {
    this.$axios({
      url: '/HrApi/Finance/GetTypeList',
      method: 'GET',
    }).then(res => {
      if (!res.data.code) {
        this.options = res.data.data;
      }
    })
    this.$axios({
      url: '/HrApi/Finance/GetStatusList',
      method: 'GET',
    }).then(res => {
      if (!res.data.code) {
        this.options1 = res.data.data;
      }
    })
    //编辑
    if (Object.keys(this.$route.query).length) {
      this.Type = "Edit";
      this.$axios({
        url: '/HrApi/Finance/GetAttendanceInfo',
        method: 'GET',
        params: {
          pk_Account: this.$route.query["pk_Account"]
        }
      }).then(res => {
        if (!res.data.code) {
          this.AccountEditInfo = res.data.data
        } else {
          this.$message.error(res.data.msg)
        }
      })
    }
  }
}
</script>